<template>
    <el-container>
    <el-header class="header" height="100px"  >
      <h3>我的网站</h3> <!-- keepAlive -->
      <p>图书管理系统</p>
    </el-header>
    <el-container>
      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
          <el-menu :default-openeds="['1', '2']"  :router="true">
            <!-- 图书管理 -->
            <el-submenu index="1">
              <template slot="title"><i class="el-icon-menu"></i>图书管理</template>
              <el-menu-item-group>
                <el-menu-item index="/booklist" >图书列表</el-menu-item>
                <el-menu-item index="/jieyue" >我的图书</el-menu-item>
              </el-menu-item-group>
              <!-- 用户管理 -->
            </el-submenu>
            <el-submenu index="2">
              <template slot="title" ><i class="el-icon-setting"></i>后台管理</template>
               
              <el-menu-item-group>
                <el-menu-item index="/yonghu">用户管理</el-menu-item>
                <!-- <el-menu-item index="/bumen">部门管理</el-menu-item> -->
                <!-- <el-menu-item index="/caidan">菜单权限</el-menu-item> -->
              </el-menu-item-group>
            </el-submenu>
          </el-menu>
        </el-aside>
        <el-container>
            <el-header style="text-align: right; font-size: 12px ; height:30px;  background-color: #B3C0D1;">
               <span>用户</span>
               <el-dropdown>
                <i class="el-icon-setting" style="margin-right: 15px"></i>
                  <el-dropdown-menu slot="dropdown">
                    <el-button @click="fff">查看用户</el-button>
                    <el-button  @click="exit">退出</el-button>
                  </el-dropdown-menu>
                </el-dropdown>
            </el-header>
          <el-main>
            <!-- 主体 -->
            <router-view></router-view>
          </el-main>
      </el-container>
    </el-container>
  </el-container>
</template>

<script>
export default {
  name:"home",
  data () {
    return {
    
    }
  },
  methods: {
    exit(){
      this.$router.push("/")
    },
    fff(){
      this.$router.push('/yonghu')
    }
  }
}
</script>

<style scoped>
.el-aside {
  background-color: rgb(255, 255, 255)  !important;
}
.el-container {
  height: 100%;
}
.el-card__body{
  padding: 0;
}

</style>
